"use strict";
import * as React from 'react';
import { autoSize, commonStyles } from "../assets/styles/common";
import MyText from "./MyText";
import MyImage from "./MyImage";
const { Image, View, TouchableOpacity } = require('react-native');
class Avatar extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.state = {
            source: props.source
        };
    }
    renderContent() {
        const { content } = this.props;
        if (content) {
            if (typeof content === 'string') {
                return <MyText fontSize={12} color='#999'>{content}</MyText>;
            }
            else if (Array.isArray(content)) {
                return content;
            }
            else {
                return content;
            }
        }
        return null;
    }
    render() {
        const { size, circle, borderWidth, borderColor, source } = this.props;
        if (source) {
            if (this.props.onPress) {
                return (<TouchableOpacity onPress={this.props.onPress}>
                        <MyImage {...this.props} source={source} placeholder={require('../assets/image/default-avatar.png')} style={[{
                        borderRadius: circle ? size / 2 : 0,
                        borderWidth,
                        borderColor
                    }, this.props.style]}/>
                    </TouchableOpacity>);
            }
            return (<MyImage {...this.props} placeholder={require('../assets/image/default-avatar.png')} style={[{
                    borderRadius: circle ? size / 2 : 0,
                    borderWidth,
                    borderColor
                }, this.props.style]}/>);
        }
        else {
            if (this.props.onPress) {
                return (<TouchableOpacity onPress={this.props.onPress}>
                        <View style={[{
                        width: size,
                        header: size,
                        borderRadius: circle ? size / 2 : 0,
                        borderWidth,
                        borderColor,
                        backgroundColor: '#f4f4f4'
                    }, commonStyles.centerVH, this.props.style]}>
                            {this.renderContent()}
                        </View>
                    </TouchableOpacity>);
            }
            return (<View style={[{
                    width: size,
                    height: size,
                    borderRadius: circle ? size / 2 : 0,
                    borderWidth,
                    borderColor,
                    backgroundColor: '#f4f4f4'
                }, commonStyles.centerVH, this.props.style]}>
                    {this.renderContent()}
                </View>);
        }
    }
}
Avatar.defaultProps = {
    size: autoSize(40),
    circle: true,
    borderWidth: 0,
    borderColor: 'transparent',
    content: null,
    onPress: null,
};
export default Avatar;
